<template>
  <div class="temporary-drafts">
    <el-dialog
      title="日志"
      v-model="visible" 
      width="900"
      @close="close"
    >
    <VTable ref="tableRef" v-bind="tableOptins">
      <template #toolbar_btns></template>
    </VTable>
      <template #footer>
        <el-button @click="close">关 闭</el-button>
    </template>
    </el-dialog>

  </div>
</template>
<script setup name="ViewLog"> 
const props = defineProps({
  api: {
    type: Function,
    default: ()=> ()=>{}
  },
})
  const visible = ref(false)
  const params = ref(null)
  const tableOptins = reactive({
  formConfig: {
    data: {}
  },
  columns: [
    { field: 'name', title: '日期' },
    { field: 'nickname', title: '人员' },
    { field: 'role', title: '操作内容' ,showOverflow: true}
  ],
  proxyConfig: {
    seq: true, // 启用动态序号代理（分页之后索引自动计算为当前页的起始序号）
    props: {
      result: 'result',
      total: 'total'
    },
    ajax: {
      // 接收 Promise
      query: ({ page, form }) => {
        return findPageList(params.value)
      }
    }
  }
})
// 列表数据
const findPageList = (data) => {
  return new Promise(resolve => {
    props.api(data)
      .then((res) => {
        resolve({
          result: res.data,
          total:res.total
        })
      })
      .catch(() => resolve([]))
  })
}
const open = (data) => {
 params.value = data
 visible.value = true
}
const close = ()=>{
  visible.value = false
}
defineExpose({ open })
</script>